<template>
  <div id="check-detail">
    <page-layout :title="'作品id: ' + artDetail.id" v-if="artDetail.id != null">
      <detail-list size="small" :col="2" slot="headerContent">
        <div class="art-cover">
          <viewer class="art-cover" :images="[ipfsUrl + artDetail.shop_hash]"
            ><img :src="ipfsUrl + artDetail.shop_hash"
          /></viewer>
        </div>
        <detail-list-item term="作品名">{{ artDetail.title }}</detail-list-item>
        <detail-list-item term="分类">{{
          artDetail.classify
        }}</detail-list-item>
        <detail-list-item term="创建时间">2018-08-07</detail-list-item>
        <detail-list-item term="作者地址" v-if="artDetail.user"
          ><a>{{ artDetail.user.address }}</a></detail-list-item
        >
        <detail-list-item term="描述" class="art-desc">{{
          artDetail.info
        }}</detail-list-item>
      </detail-list>

      <template slot="action" v-if="artDetail.status=='audit'">
        <a-button-group style="margin-right: 8px">
          <a-button type="primary"
            ><a-popconfirm
              title="是否审核通过?"
              ok-text="确定"
              cancel-text="取消"
              @confirm="confirm"
              @cancel="cancel"
            >
              <a href="#">通过</a>
            </a-popconfirm></a-button
          >
          <a-button @click="isShowRejectPop = true">驳回</a-button>
          <a-button><a-icon type="ellipsis" /></a-button>
        </a-button-group>
      </template>

      <!-- <a-card style="margin-top: 24px" :bordered="false" title="用户信息">
      </a-card> -->
      <template slot="extra">
        <head-info title="查重情况" :content="checkResult.msg"/>
      </template>
    </page-layout>

    <!-- 弹框组件 -->
    <RejectPop
      :show="isShowRejectPop"
      :popData="{id:artDetail.id}"
      @close="isShowRejectPop = false"
    />
  </div>
</template>

<script>
import PageLayout from "@/layouts/PageLayout";
import DetailList from "@/components/tool/DetailList";
import HeadInfo from "@/components/tool/HeadInfo";
import RejectPop from "./RejectPop";
import { setSuccess,checkSamework } from "@/api";
import {
  operation1,
  operation2,
  operation3,
  operationColumns,
} from "@/mock/common/tableData";
import { mapState } from "vuex";

const DetailListItem = DetailList.Item;

const tabList = [
  {
    key: "1",
    tab: "操作日志一",
  },
  {
    key: "2",
    tab: "操作日志二",
  },
  {
    key: "3",
    tab: "操作日志三",
  },
];

export default {
  name: "CheckDetail",
  components: {
    DetailListItem,
    DetailList,
    PageLayout,
    HeadInfo,
    RejectPop,
  },
  data() {
    return {
      tabList,
      operationColumns,
      operation1,
      operation2,
      operation3,
      activeTabKey: "2",

      // 是否展示弹出框
      isShowRejectPop: false,

      // ipfsurl
      ipfsUrl: "http://106.55.165.19:8888/ipfs/",

      id: 0,

      // checkResult
      checkResult:{}
    };
  },
  computed: {
    ...mapState("setting", ["isMobile"]),
    ...mapState({
      artDetail: (store) => store.artwork.artDetail,
    }),
  },
  mounted() {
    let { id } = this.$route.params;
    this.id = id;
    this.$store.dispatch("artDetail", id);

    // 查询是否有相同作品
    checkSamework(id).then(res=>{this.checkResult = res})
  },
  methods: {
    onTabChange(key) {
      console.log(key);
    },
    async confirm() {
      // 同意上架
      let result = await setSuccess(this.id);
      console.log(result);
      this.$router.push("/success?msg=" + result.msg);
    },
    cancel(e) {
      console.log(e);
      this.$message.error("Click on No");
    },
  },
};
</script>

<style lang='less'>
#check-detail {
  .art-cover {
    height: 100px;
    margin-bottom: 20px;
    img {
      height: 100%;
    }
  }
}
</style>